<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:constants="http://www.tuanzi.com/constants/tags"
      xmlns:composite="http://java.sun.com/jsf/composite">

<composite:interface>
    <composite:attribute name="panelGroupRendered" required="true"/>
    <composite:attribute name="searchConditionName" required="true"/>
    <composite:attribute name="searchConditionAccount" required="true"/>
    <composite:attribute name="searchConditionEmail" required="true"/>
    <composite:attribute name="searchConditionPhone" required="true"/>
    <composite:attribute name="searchConditionEnable" required="true"/>
    <composite:attribute name="lazyDataModel" required="true"/>
    <composite:attribute name="relateButtonRendered" required="true"/>
    <composite:attribute name="unrelateButtonRendered" required="true"/>
    <composite:attribute name="relateActionListener" method-signature="void action()" required="true"/>
    <composite:attribute name="unrelateActionListener" method-signature="void action()" required="true"/>
</composite:interface>

<composite:implementation>
    <h:panelGroup rendered="#{cc.attrs.panelGroupRendered}">
        <div class="ui-g-8">
            <div class="card">
                <h1>查询条件</h1>
                <p:panelGrid columns="4" layout="grid"
                             columnClasses="ui-grid-col-2,ui-grid-col-3,ui-grid-col-2,ui-grid-col-3"
                             styleClass="ui-panelgrid-blank"
                             style="border:0px none; background-color:transparent;">

                    <p:outputLabel for="name" value="姓名"/>
                    <p:inputText id="name" value="#{cc.attrs.searchConditionName}"/>

                    <p:outputLabel for="account" value="用户名"/>
                    <p:inputText id="account" value="#{cc.attrs.searchConditionAccount}"/>

                    <p:outputLabel for="email" value="邮箱"/>
                    <p:inputText id="email" value="#{cc.attrs.searchConditionEmail}"/>

                    <p:outputLabel for="phone" value="联系电话"/>
                    <p:inputText id="phone" value="#{cc.attrs.searchConditionPhone}"/>

                    <p:outputLabel for="enable" value="是否启用"/>
                    <p:selectOneMenu id="enable" value="#{cc.attrs.searchConditionEnable}">
                        <f:selectItem itemLabel="- 请选择 -" itemValue="" noSelectionOption="true"/>
                        <f:selectItem itemLabel="是" itemValue="true"/>
                        <f:selectItem itemLabel="否" itemValue="false"/>
                    </p:selectOneMenu>

                </p:panelGrid>
            </div>
            <div class="card">
                <h1>用户列表</h1>
                <p:dataTable
                        style="width: 100%"
                        var="user"
                        value="#{cc.attrs.lazyDataModel}"
                        rows="#{constants:get('ROWS')}"
                        lazy="true"
                        paginator="true"
                        paginatorTemplate="#{constants:get('PAGINATOR_TEMPLATE')}"
                        rowsPerPageTemplate="#{constants:get('ROWS_PER_PAGE_TEMPLATE')}"
                        emptyMessage="#{constants:get('EMPTY_MESSAGE')}"
                        reflow="true"
                        scrollable="true"
                        scrollWidth="97%"
                        resizableColumns="true">
                    <p:column headerText="操作">
                        <p:commandButton value="关联" icon="fa fa-retweet"
                                         actionListener="#{cc.attrs.relateActionListener}"
                                         update="@form" process="@this"
                                         rendered="#{cc.attrs.relateButtonRendered}"/>
                        <p:commandButton value="取消关联" icon="fa fa-random"
                                         actionListener="#{cc.attrs.unrelateActionListener}"
                                         update="@form" process="@this" rendered="#{cc.attrs.unrelateButtonRendered}"/>
                    </p:column>
                    <p:column headerText="姓名">
                        <h:outputText value="#{user.name}"/>
                    </p:column>
                    <p:column headerText="用户名">
                        <h:outputText value="#{user.account}"/>
                    </p:column>
                    <p:column headerText="邮箱">
                        <h:outputText value="#{user.email}"/>
                    </p:column>
                    <p:column headerText="联系电话">
                        <h:outputText value="#{user.phone}"/>
                    </p:column>
                    <p:column headerText="合作机构">
                        <h:outputText value="#{user.partnerName}"/>
                    </p:column>
                    <p:column headerText="是否启用">
                        <h:outputText value="#{user.enable ? '是' : '否'}"/>
                    </p:column>
                </p:dataTable>
            </div>
        </div>
    </h:panelGroup>
</composite:implementation>
</html>